<template>
  <div class="ds-grace-cell p-2 bg-blue-300 bg-opacity-10">
    <ds-title v-if="title" :name="title" />
    <slot />
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import DsTitle from "./DsTitle.vue";
export default defineComponent({
  name: 'DsGraceCell',
  components: {DsTitle},
  props: {
    title: {
      type: String,
      default: ''
    }
  }
})
</script>
<style lang="scss">
.ds-grace-cell {
  border-image-source: url(../assets/images/border-2-1.png);
  border-image-slice: 10 fill;
  border-width: 5px;
  border-style: solid;
  background-clip: padding-box;
}
</style>